<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/car.css">
    <script src="../js/axios.min.js"></script>
    <link rel="stylesheet" href="../css/car2.css">
</head>
<body>
     <!-- 头部 -->
  <div class="headerWarp">
    <div class="header">
      <div class="logo1"><img src="../images/header-1.jpg" alt=""></div>
      <div class="headerSearch">
        <input type="button" value="" class="searchBtn">
        <input type="text" placeholder="漫步者" class="wenzi">
      </div>
      <div class="shoping"><img src="../images/header-2.jpg" alt=""></div>
      <div class="headerend">
        <span>登录</span>
      </div>
    </div>
  </div>


<div class="bannerWarp">
    <div class="banner">
        <h2>购物车</h2>
        <hr>
        <!-- <div class="nav">
            <span>全选</span>
            <span>商品</span>
            <span>金额</span>
            <span>数量</span>
            <span>小计</span>
            <span>操作</span>
        </div> -->
        <!-- <div class="box">
            <div class="top">
                <span>全部商品</span>
                <img src="../images/manjian.jpg" alt="">
                <span>全场满</span>
                <span>￥199</span>
                <span>免运费</span>
            </div>

             购物车的主要内容区域 框架 书写
            <div class="middle" id="middle">
              <img src="" alt="">
              <li></li>
              <li></li>
              <input type="number" id="" min="1">
            </div>


            <div class="end">
                <span>全选</span>
                <span>已选择 件商品</span>
                <span>已享受免费运费I合计:</span>
                <div class="jiesuan">结算</div>
            </div>
        </div> -->



        <div id="box">
          <table id="cart">
              <tr id="head">
                  <td width="100px"><input class="allSelect" type="checkbox"> 全选</td>
                  <td width="600px;">商品</td>
                  <td width="200px">单价</td>
                  <td width="200px">数量</td>
                  <td width="200px" id="remove">小计</td>
                  <td width="100px">操作</td>
              </tr>
              <tr>
                  <td><input class="select" type="checkbox"></td>
                  <td class="goods"><img src="../images/shoping-3.jpg">外星人笔记本电脑17 R4 15R3 13寸 17寸 alienware今晚吃鸡游戏本</td>
                  <td class="price">12888.00</td>
                  <td>
                      <div class="number">
                          <div class="desymbol">-</div>
                          <div class="acc">1</div>
                          <div class="adsymbol">+</div>
                      </div>
                  </td>
                  <td class="total"></td>
                  <td class="dele">删除</td>
              </tr>
              <tr>
                  <td><input class="select" type="checkbox"></td>
                  <td class="goods"><img src="../images/shoping-1.jpg">任天堂（Nintendo）Switch 家用游戏机 掌机NS智能体感游戏主机</td>
                  <td class="price">2258.00</td>
                  <td>
                      <div class="number">
                          <div class="desymbol">-</div>
                          <div class="acc">1</div>
                          <div class="adsymbol">+</div>
                      </div>
                  </td>
                  <td class="total"></td>
                  <td class="dele">删除</td>
              </tr>
              <tr>
                  <td><input class="select" type="checkbox"></td>
                  <td class="goods"><img src="../images/shoping-2.jpg">Microsoft/微软 Surface Pro i5 8G 256G 笔记本平板电脑二合一</td>
                  <td class="price">4999.00</td>
                  <td>
                      <div class="number">
                          <div class="desymbol">-</div>
                          <div class="acc">1</div>
                          <div class="adsymbol">+</div>
                      </div>
                  </td>
                  <td class="total"></td>
                  <td class="dele">删除</td>
              </tr>
              <tr>
                  <td><input class="select" type="checkbox"></td>
                  <td class="goods"><img src="../images/shoping-4.jpg">Apple/苹果 10.5 英寸 iPad Pro</td>
                  <td class="price">3666.00</td>
                  <td>
                      <div class="number">
                          <div class="desymbol">-</div>
                          <div class="acc">1</div>
                          <div class="adsymbol">+</div>
                      </div>
                  </td>
                  <td class="total"></td>
                  <td class="dele">删除</td>
              </tr>
          </table>
  
          <div id="settlement">
              <div style="width:600px"><input class="allSelect" type="checkbox"> 全选</div>
              <div style="width:400px">全选商品<span id="NumofGoods"></span><span>件^</span></div>
              <div style="width:250px">合计：¥<span id="addupto"></span></div>
              <div style="width:50px;text-align: center;border-left:1px solid #000000;">结算</div>
          </div>
      </div>
      <script src="../js/car2.js"></script>
  



    </div>
</div>
<!-- <script src="../js/car.js"></script> -->


   <!-- 右侧固定 -->
   <div class="fixed">
    <ul>
      <li>查看营业执照</li>
      <li>100%正品</li>
      <li>七天无理由置换</li>
      <li> <img src="../images/header-2.jpg" alt=""></li>
      <li class="liend"> 
        <a href="#top" target="_self"> Top</a>
        </li>
    </ul>
  </div>

  <!-- 脚部导航栏 -->
  <div class="footerWarp">
    <div class="footer">
      <div class="footerLeft">
        <div class="footerTop">
          <ul>
                <li><a href="https://st.music.163.com/official-terms/service">服务条款</a> </li>
                <li><a href="https://st.music.163.com/official-terms/privacy">隐私条款</a> </li>
                <li><a href="https://st.music.163.com/official-terms/children">儿童隐私政策</a></li>
                <li><a href="https://music.163.com/st/staticdeal/complaints.html">版权投诉指引</a></li>
                <li><a href="https://mp.music.163.com/600948c936c13f4d09752e73/contact-us-web/index.html?source=Music-Mall">联系我们</a></li>
          </ul><br>
          <p>网易公司版权所有1997-2022杭州乐读科技有限公司运营：浙网文[2021]1186-054号
          </p>
          <p><span><a href="https://p6.music.126.net/obj/wo3DlcOGw6DClTvDisK1/11202823048/cd21/9c11/b6ec/a94ff538fff84c7efd4529ed8f6b0c4e.png">食品经营许可证</a></span> 
            <span><a href="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/12636982313/1de4/4c7e/43ac/fa093172a14ac87d48fc5447c6895d4b.jpg">出版物经营许可证</a></span> 
           <span><a href="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/3920675333/e94d/cbaf/a3ad/5c24a5e9d195457ad1c6bb2f1274c807.jpg"></a>营业执照</span>  网络食品交易第三方平台提供者信息备案：浙网食A33010041进口冷链管理承诺书
          </p>
          <p>粤B2-20090191-18举报邮箱：工业和信息化部备案管理系统网站
          </p>
      </div>
      </div>
      <div class="footerRight">
        <ul>
          <li>
           <img src="../images/footer-1.jpg" alt="">
            <p>独立音乐人</p>
          </li>
          <li>
            <img src="../images/footer-2.jpg" alt="">
            <p>音乐专栏</p>
          </li>
          <li>
            <img src="../images/footer-3.jpg" alt="">
            <p>自媒体</p>
          </li>
          <li>
            <img src="../images/footer-4.jpg" alt="">
            <p>赞赏</p>
          </li>
        </ul>
      </div>
    </div>
  </div> 
</body>
</html>